<template>
<view>
	<auto-round startColor="#195252b5">
		<own-card-title icon="icon-kefu1" :title="'员工管理('+workerList.length+')'" subTitle="在这里完成员工的管理"/>
	</auto-round>
	
	<own-card-list>
		<auto-empty v-if="workerList.length<=0" msg="暂无员工,赶紧去添加一个"/>
		<own-card-detail v-for="worker in workerList" :name="worker.name" :status="worker.status" :objId="worker.id"
			@onUpdateStatus="onUpdateStatus" @onEdit="onDelete" :key="worker.id" cardType="worker">
			<view class="label-group">
				<span class="label">姓名：</span><span class="value">{{worker.name}}</span>
			</view>
			<view class="label-group">
				<span class="label">电话：</span><span class="value">{{worker.phone}}</span>
			</view>
			<view class="label-group">
				<span class="label">创建时间：</span><span class="value">{{worker.createTime}}</span>
			</view>
			<view class="label-group" v-if="worker.updateTime">
				<span class="label">更新时间：</span><span class="value">{{worker.updateTime}}</span>
			</view>
		</own-card-detail>
	</own-card-list>
	<own-card-fun @onAdd="onAdd"/>
	
	<auto-modal :show="addVisible" title="添加员工" :cancel="false" @onOpt="onAddOpt" @onClose="onAddOpt('cancel')">
		<view class="form-group">
			<image :src="qrUrl" class="shop-qr" mode="aspectFit"/>
		</view>
		<view class="zsl-remark">
			将此小程序码给员工扫码完成添加
		</view>
	</auto-modal>
</view>
</template>

<script>
var that;
export default {
	data() {
		return {
			workerList: [],
			addVisible: false,
			qrUrl: ''
		}
	},
	onLoad() {
		that = this;
		that.loadData();
	},
	methods: {
		loadData: function() {
			this.$request.get("/worker/listWorker", {}).then((res) => {
				console.log(res)
				that.workerList = res.workerList;
			})
		},
		onAdd: function() {
			this.$request.get("/worker/onAddWorker", {}).then((res) => {
				that.addVisible = true;
				that.qrUrl = res.data.addWorkerQr;
			})
		},
		onAddOpt: function(flag) {
			this.addVisible = false;
		},
		onUpdateStatus: function(objId, status) {
			const index = this.workerList.findIndex((item)=>item.id===objId);
			let tarObj = this.workerList[index];
			if(tarObj.isBoss==='1') {
				that.$common.showNormalToast("不能修改老板状态");
				return false;
			}
			this.$request.get("/worker/updateStatus", {id: objId, status: status, field: 'status'}, {method: "post"}).then((res) => {
				tarObj.status = status;
				that.workerList.splice(index, 1, tarObj);
				that.$common.showNormalToast(res.msg);
			})
		},
		onDelete: function(objId) {
			const index = this.workerList.findIndex((item)=>item.id===objId);
			let tarObj = this.workerList[index];
			if(tarObj.isBoss==='1') {
				that.$common.showNormalToast("不能删除老板");
				return false;
			}
			uni.showModal({
				title: "删除提醒",
				content: "此操作不可逆，确定删除吗？",
				success(result) {
					if(result.confirm) {
						that.$request.get("/worker/updateStatus", {id: objId, status: "1", field: 'deleteFlag'}, {method: "post"}).then((res) => {
							that.$common.showNormalToast(res.msg);
							that.workerList.splice(that.workerList.findIndex((item)=>item.id===objId), 1);
						})
					}
				}
			})
		}
	}
}
</script>

<style>
.shop-qr {
	width: 80%; margin-left: 10%; border:1px #ddd solid; border-radius: 10rpx;
}
.zsl-remark {
	text-align: center;
}
</style>
